import React, { useState } from 'react';
import { createTopic } from '../api';
import { useNavigate } from 'react-router-dom';

const NewTopic: React.FC = () => {
  const [name, setName] = useState('');
  const [description, setDescription] = useState('');
  const navigate = useNavigate();

  const handleSubmit = async () => {
    if (name.trim() && description.trim()) {
      const res = await createTopic({ name, description });
      navigate(`/topics/${res.data.data.id || res.data.data._id || res.data._id}`);
    }
  };

  return (
    <div>
      <h2>新建话题</h2>
      <input
        value={name}
        onChange={e => setName(e.target.value)}
        placeholder="话题名称"
      />
      <textarea
        value={description}
        onChange={e => setDescription(e.target.value)}
        placeholder="话题描述"
      />
      <button onClick={handleSubmit}>发布</button>
    </div>
  );
};

export default NewTopic;